/**
 * 项目管理的Route Component
 * @author: zxy
 * @update: 2017-03-15
 */

import React, {PropTypes} from 'react';
import {connect} from 'dva';
import StoreSettingMenu from '../../components/StoreSetting/StoreSettingMenu';
import ProjectManageSearch from '../../components/ProjectManage/ProjectManageSearch';
import ProjectManageList from '../../components/ProjectManage/ProjectManageList';
import ProjectManageModal from '../../components/ProjectManage/ProjectManageModal';
import ProjectManageCopy from '../../components/ProjectManage/ProjectManageCopy';

function ProjectManage({location, dispatch, projectManage}) {

  const {
    total, pageNumber, loading, pageSize, modalVisible, list, modalLoading, modalType, query, btnLoading,
    copyNum, copyModalVisible, copyId,
  } = projectManage;


  // 项目搜索props
  const ProjectManageSearchProps = {
    handleSubmitOk(data){
      dispatch({
        type: 'projectManage/query',
        payload: {
          product_name: data.product_name,
        }
      })
    }
  }

  // 项目列表props
  const ProjectManageListProps = {
    total, pageNumber, loading, pageSize,
    dataSource: list,

    onPageChange(page) {
      dispatch({
        type: 'memberCard/query',
        payload: {
          pageNumber: page,
          pageSize,
        },
      });
    },

    onShowSizeChange(current, pageSize) {
      dispatch({
        type: 'memberCard/query',
        payload: {
          pageNumber: current,
          pageSize,
        },
      });
    },

    // 添加项目
    onAdd() {
      dispatch({
        type: 'projectManage/showModal',
      })
    },

    // 编辑项目
    onEditItem(id) {
      dispatch({
        type: 'projectManage/detail',
        payload: {
          modalType: 'update',
          id,
        },
      });
    },

    // 复制
    onCopy(id){
      dispatch({
        type: 'projectManage/updateAction',
        payload: {
          copyModalVisible: true,
          copyId: id,
        },
      });
    },
  }

  // 项目modal的props
  const ProjectManageModalProps = {
    title: modalType === 'create' ? '添加项目' : '编辑项目',
    item: modalType === 'create' ? {} : item,
    visible: modalVisible,
    modalLoading,
    btnLoading,
    onCancel(){
      dispatch({
        type: 'projectManage/hideModal',
      })
    },
    onOkAndAdd(formData, fn) {
      dispatch({
        type: `projectManage/${modalType}`,
        payload: {
          formData,
          fn,
          pageNumber: 1,
          pageSize,
        }
      });
    },
    onOk(formData, fn) {
      dispatch({
        type: `projectManage/${modalType}`,
        payload: {
          formData,
          fn,
          pageNumber: 1,
          pageSize,
        }
      });
    },
  }

  // 复制modal的props
  const ProjectManageCopyProps = {
    visible: copyModalVisible,
    copyNum,
    copyId,
    onCancel(e){
      dispatch({
        type: 'projectManage/updateAction',
        payload: {
          copyModalVisible: false,
          copyNum: 1,
        }
      })
    },
    onOk(formData, fn) {
      dispatch({
        type: `projectManage/${modalType}`,
        payload: {
          formData,
          fn,
          pageNumber: 1,
          pageSize,
        }
      });
    },
    onChange(changedFields){
      dispatch({
        type: 'projectManage/updateAction',
        payload: {
          copyNum: changedFields.copyNum ? changedFields.copyNum.value : 1,
        },
      });
    },
  }

  return (
    <div className="page-wrap">
      <StoreSettingMenu current={location.pathname}/>
      <div className="page-content">
        <ProjectManageSearch {...ProjectManageSearchProps}/>
        <ProjectManageList {...ProjectManageListProps}/>
        <ProjectManageModal {...ProjectManageModalProps}/>
        <ProjectManageCopy {...ProjectManageCopyProps}/>
      </div>
    </div>
  );
}

ProjectManage.propTypes = {
  location: PropTypes.object,
  dispatch: PropTypes.func,
  storeInfo: PropTypes.object,
};

export default connect(({projectManage}) => ({projectManage}))(ProjectManage);